<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
	<title>Title of the document</title>
	
	<script type = "text/javascript">
		function showMenu(menu)	{
			document.getElementById(menu).style.display = "inline";			
		}
		
		function hideMenu(menu)	{
			document.getElementById(menu).style.display = "none";			
		}
		
	</script>	
</head>

<body>
	<table border = "1">
		<tr >
			<td onmouseover = "showMenu('fristDropdown')" onmouseout = "hideMenu('fristDropdown')"
				style = "padding:0px">
				Block one				
			</td>
				<div id = "fristDropdown" onmouseover = "showMenu('fristDropdown')" onmouseout = "hideMenu('fristDropdown')"
					style = "display:none; top:32px; left:15px;position:absolute;">
					<div>1.first</div>
					<div>1.second</div>
					<div>1.third</div>
				</div>
			<td onmouseover = "showMenu('secondDropdown')" onmouseout = "hideMenu('secondDropdown')"
				style = "padding:0px">
				Block two
			</td>
				<div id = "secondDropdown" onmouseover = "showMenu('secondDropdown')" onmouseout = "hideMenu('secondDropdown')"
					style = "display:none; top:32px; left:85px;position:absolute">
					<div>2.first</div>
					<div>2.second</div>
					<div>2.third</div>
				</div>
		</tr>
	</table>
</body>

</html>